/* eslint-disable no-unused-vars */
import { Network } from "vis-network";

import GROUP_COLORS from "./GraphColorSets";

let network = undefined;

function initGraph(containerElement,onclick) {
    const options = {
        nodes: {
            shape: "circle",
            margin:15,
            shapeProperties: {
                borderRadius: 20
            },
            shadow: {
                enabled: true,
                size: 3,
                x: 3,
                y:3
            }
        },
        edges: {
            arrows: "from",
            color: {
                color: "#3e3e3e",
                hover: "#3e3e3e",
                highlight: "#3e3e3e",
                inherit:false
            },
            font: {
                align: "top"
            },
            width:2
        },
        interaction: {
            hover:true
        },
        physics: {
            barnesHut: {
                gravitationalConstant:-40000
            }
        }
    };
    
    network = new Network(containerElement, {}, options);

    network.on("click", onclick);
}

// update data and randomly choose a color set
function updateGraph(newData,isRoute=false) {
    network.setData(newData);

    const selectedGroupColorIndex = Math.floor(Math.random() * GROUP_COLORS.length);

    let newColorOptions = undefined;

    if (isRoute) {
        newColorOptions = {
            groups: {
                "0": {
                    color: "#83E083"
                },
                "1": {
                    color: GROUP_COLORS[selectedGroupColorIndex][1],
                    font: {
                        color: "#ffffff"
                    }
                },
                "2": {
                    color: "#FF8E8E"
                }
            }
        }
    }
    else {
        newColorOptions = {
            groups: {
                "0": {
                    color: GROUP_COLORS[selectedGroupColorIndex][0]
                },
                "1": {
                    color: GROUP_COLORS[selectedGroupColorIndex][1],
                    font: {
                        color: "#ffffff"
                    }
                },
                "2": {
                    color: GROUP_COLORS[selectedGroupColorIndex][2],
                    font: {
                        color: "#ffffff"
                    }
                }
            }
        }
    }


    network.setOptions(newColorOptions);
}

export { initGraph,updateGraph };